<template>
  <div class="">
    <!-- 电脑端banner -->
    <div class="pCBanner hidden-xs">
      <img src="../assets/images/banner2@2x.jpg">
      <div class="PhoneNumber">
        <!-- 全国服务热线：{{footerobj.mobile}} -->
        热门资讯
      </div>
    </div>
    <!-- 电脑端banner结束 -->

    <!-- 手机端banner -->
    <div class="pCBanner visible-xs-block">
      <img src="../assets/images/banner2@2x.jpg">
      <div class="PhoneNumber">
        热门资讯
        <!-- 全国服务热线：{{footerobj.mobile}} -->
      </div>
    </div>
    <!-- 手机端banner结束 -->

    <!-- 电脑端资讯开始 -->
    <div class="Zixun hidden-xs">
      <div class="Suaini" v-if="list.length>3">
        <img src="../assets/images/bg3_zuo2@2x.png">
      </div>
      <div class="container">
        <div class="Uker02DetialCom" @click="getrouter(listf.id)">
          <div class="Uker02DetialComLeft">
            <img :src="listf.image" style="width: 100%;height: 100%;">
          </div>
          <div class="Uker02DetialComRight">
            <div class="Uker02DetialComRightTop">
              <p>{{listf.addtime}}</p>
            </div>
            <div class="Uker02DetialComRightCom">
              <p>{{listf.title}}</p>
              <p>{{listf.content}}</p>
            </div>
          </div>
        </div>
        <div class="ZixunCom">
          <div class="ZixunComItem" v-for="(item,index) in list" @click="getrouter(item.id)" :key="index">
            <div class="ZixunComItemTop">
              {{item.title}}
            </div>
            <div class="ZixunComItemSite">
             {{item.addtime}}
            </div>
            <div class="ZixunComItemConser">
              {{item.content}}
            </div>
          </div>
        </div>
      </div>
      <div class="Wuaisu" v-if="list.length>3">
        <img src="../assets/images/pic5@2x.png">
      </div>
    </div>
    <!-- 电脑端资讯结束 -->

    <!-- 手机端资讯开始 -->
    <div class="Zixun visible-xs-block">
      <div class="container">
        <div class="Uker02DetialCom" @click="getrouter(listf.id)">

          <div class="Uker02DetialComRight">
            <div class="Uker02DetialComRightTop">
              <p>{{listf.addtime}}</p>
            </div>
            <div class="Uker02DetialComRightCom">
              <p>{{listf.title}}</p>
              <p>{{listf.content}}</p>
            </div>
          </div>
          <div class="Uker02DetialComLeft">
            <img :src="listf.image" style="width: 100%;height: 100%;">
          </div>
        </div>
        <div class="ZixunCom">
          <div class="ZixunComItem" v-for="(item,index) in list" @click="getrouter(item.id)" :key="index">
            <div class="ZixunComItemTop">
              {{item.title}}
            </div>
            <div class="ZixunComItemSite">
              {{item.addtime}}
            </div>
            <div class="ZixunComItemConser">
              {{item.content}}
            </div>
          </div>
        </div>
      </div>
      <div class="Wuaisu">
        <img src="../assets/images/pic5@2x.png">
      </div>
    </div>
    <!-- 手机端资讯结束 -->
  </div>
</template>

<script>
  import { newslist } from '@/api/utils.js'
  export default {
    name: '',
    components: {},
    props: ["footerobj"],
    data() {
      return {
        page: 1,
        listf: {},
        list: []
      }
    },
    computed: {},
    watch: {},
    created() {
      this.getnewslist()
    },
    mounted() {},
    methods: {
      getrouter(e) {
        this.$router.push({path: '/informationdetail',query: {id:e}})
      },
      getnewslist() {
        var that = this,
        params = {
          page: this.page
        }
        newslist(params).then(res => {
          if (res.Code == 1) {
            for (var i = 0; i < res.data.newslist.length; i++) {
              let text = res.data.newslist[i].content,
              replace = text.replace(/<[^>]+>/g,"")
              res.data.newslist[i].content = replace.replace(/&nbsp;/ig, '')
            }
            that.listf = res.data.newslist.splice(0,1)[0]
            that.list = res.data.newslist
          }
        })
      },
    }
  }
</script>

<style lang="scss" scoped>
  @import url("../assets/css/basic.css");
  @import url("../assets/css/media.css");
  @media only screen and (min-width: 100px) and (max-width: 998px) {
    .pCBanner img {
      height: auto;
    }
  }
</style>